<template>
	<view>
		<view class="userinfo">
		  <image src="/static/ulogo.jpg" />
		  <text>{{user.uname}}</text>
		</view>
		<view class="container">
		  <view class="user-item commenu">
		    <view>
		      <image src="/static/cart-Empty.png"></image>
		      <text>待付款</text>
		    </view>
		    <view>
		      <image src="/static/map.png"></image>
		      <text>待收货</text>
		    </view>
		    <view>
		      <image src="/static/collection.png"></image>
		      <text>待评价</text>
		    </view>
		    <view>
		      <image src="/static/password.png"></image>
		      <text>退款/售后</text>
		    </view>
		    <view>
		      <image src="/static/viewlist.png"></image>
		      <text>全部订单</text>
		    </view>
		  </view>
		
		  <view class="user-item optlist">
		    <view>
		      <navigator url="#"><text>我的收藏</text>
		      <image src="/static/arrow-right.png"/>
		      </navigator>
		    </view>
		    <view>
		      <navigator url="#"><text>我的关注</text>
		      <image src="/static/arrow-right.png"/>
		      </navigator>
		    </view>
		    <view>
		      <navigator url="#"><text>我的评论</text>
		      <image src="/static/arrow-right.png"/>
		      </navigator>
		    </view>
		    <view>
		      <navigator url="#"><text>我的信息</text>
		      <image src="/static/arrow-right.png"/>
		      </navigator>
		    </view>
		    <view>
		      <navigator url="#"><text>我的预约</text>
		      <image src="/static/arrow-right.png"/>
		      </navigator>
		    </view>
		  </view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user:{}
			}
		},
		onLoad() {
			this.$request({
				url:"/userCenter/info",
				success:(res)=>{
					console.log(res);
					this.user = res.data;
				}
			})
		},
		methods: {
			
		}
	}
</script>

<style>
/* pages/user/user.wxss */
page{
background: #F8F8FF;
}
.userinfo{
  background-color: #d81e06;
  height: 350rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius:0 0 200rpx 200rpx/0 0 80rpx 80rpx;
  padding-bottom:50rpx;
}
.userinfo image{
  width:140rpx;
  height: 140rpx;
  border-radius: 100rpx;
  margin: 0 auto;
  display: block;
}
.userinfo text{
  color:white;
  line-height: 60rpx;
  font-size: 40rpx;
  margin-top: 24rpx;
  text-align: center;
}
.container{
  margin:16rpx;
  position: relative;
  top:-100rpx;
}
.user-item{
  background-color: white;
  border-radius: 16rpx;
  box-shadow: 0 4rpx 4rpx #F8F8FF;
  padding:50rpx;
  margin-bottom: 24rpx;
}
.commenu{
  display: flex;
  flex-direction: row;
}
.commenu view{
  width:20%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.commenu view image{
  width:64rpx;
  height: 64rpx;
  margin:  0 auto;
}
.commenu text{
  font-size: 24rpx;
  text-align: center;
  line-height: 56rpx;
}
.optlist{
  display: flex;
  flex-direction: column;
}
.optlist view navigator{
  display: flex;
  flex-direction: row;
  padding:20rpx 0;
  border-bottom:1px solid #F8F8FF;
}
.optlist text{
  flex: 1;
  font-size: 32rpx;
}
.optlist image{
  width:22px;
  height: 22px;
}
</style>
